<template>
    <div>
        <navBar :navTitle="$t('Cunkuan')" prevPath="my" />
        <main class="full-width92">
            <van-form ref="refFormPassword" class="public-form">
                <b>{{ $t('Cunkuanjine') }}</b>
                <van-field class="bg-inp" v-model.trim="money" type="number" :placeholder="$t('Cunkuanjine')"
                           :rules="[{validator: checkMoney, message: errMsg }]"/>
                <!-- <div class="deposit-note">Tối thiểu là 1000</div> -->
            </van-form>

            <van-row class="money-box" gutter="10">
                <van-col span="8" v-for="(item, index) in priceArr" :key="index"
                         @click="fnBtnChangeVan(item, index)" >
                    <div class="money-num"  :class="index == activeMoney ? 'van-active' : '' ">{{ item }}</div>
                </van-col>
            </van-row>

            <van-button block type="info" class="btn-save" @click="fnGoPassageway" v-btn-re-click>{{ $t('Querencunkuan') }}</van-button>
        </main>
    </div>
</template>

<script>
export default {
    name: "myDeposit",
    data() {
        return {
            money: "",
            priceArr:['20.000.000', '50.000.000', '100.000.000 ', '200.000.000 ', '300.000.000 ', '500.000.000'],
            activeMoney: -1,  /* 选中 */
            errMsg:"",
        }
    },
    methods: {
        checkMoney(val){
            console.log(val);
            if(val <= 0){
                this.errMsg = this.$t('Bunengdengyu')
                return false
            }
        },
        /*去儲值通道*/
        fnGoPassageway(){
            this.$refs.refFormPassword.validate().then(()=>{
                this.$router.push({
                    name:"my_deposit_passageway",
                    query:{
                        money:this.money,
                    }
                })
            }).catch(res=>{})
			//this.$toast('Kênh giá trị được lưu trữ đã đầy, vui lòng liên hệ với bộ phận chăm sóc khách hàng！');
			//this.errMsg = "振瀚私募儲值通道已滿，請聯絡客服！"
			return false
        },

        /*选中*/
        fnBtnChangeVan(item, index){
            this.money = parseInt(item.replaceAll('.',''));
            this.activeMoney = index;
        }
    },
    created() {
        this.checkMoney(0)
    },
}
</script>
<style lang="scss" scoped>
.deposit-note{
    font-size: 12px;
    margin: 6px 0;
}
.money-box{
    .money-num{
        background-color: #f1eff0;
        border-radius: 6px;
        margin-bottom: 10px;
        text-align: center;
        height: 42px;
        line-height: 42px;
        font-size: 16px;
        //font-weight: bold;
    }
    .van-active{
        background-color: #3365e3;
        color: #fff;
    }
}
.btn-save{
    margin: 30px auto 10px;
}
</style>